/**
 * 改签
 * @email 626097912@qq.com
 * Created by dength on 2017/05/16
 */
import React, { Component } from 'react';
import {
    AppRegistry,
    StyleSheet,
    Text,
    View,
    TouchableOpacity
} from 'react-native';
import BaseComponent from '../base/baseComponent';
import Constants from '../base/constants';
import CommonStyles from '../base/commonStyles';
import { getNavigator } from '../route/route';
import Icon from 'react-native-vector-icons/Entypo';
import Buttom from '../common/Buttom';

class TicketChanges extends BaseComponent {
    constructor(props) {
        super(props);
    }

    getNavigationBarProps() {
        return {
            title: '改签',
            leftButtonImage: require('../images/ic_return.png'),
            hideRightButton: true,
        };
    }

    //跳转方法
    _onPress(navname) { getNavigator().push({ name: navname }); }

    renderBody() {
        return (
            <View style={styles.container}>
                <View style={[styles.box_bor, styles.box_ul]}>
                    <View style={styles.box_li}>
                        <Text style={styles.box_li_lftx}>
                            目的地
                        </Text>
                        <Text style={styles.box_li_rgtx}>
                            深圳北
                        </Text>
                    </View>
                </View>
                <View style={styles.box_ul}>
                    <View style={styles.box_li}>
                        <View>
                            <Text style={styles.box_li_lftx}>出发时间</Text>
                        </View>
                        <TouchableOpacity
                            activeOpacity={0.8}
                            style={{ flexDirection: 'row' }}>
                            <Text style={styles.box_li_tx}>
                                5月4日
                                (<Text>今天</Text>)
                            </Text>
                            <Icon name="chevron-thin-right" size={22} color="#BDC4CA" />
                        </TouchableOpacity>
                    </View>
                </View>
                <View style={styles.rule}>
                    <TouchableOpacity
                        onPress={() => this._onPress('GqCodex')}
                        activeOpacity={0.8}
                        >
                        <Text style={styles.rule_tx}>
                            《改签说明》
                        </Text>
                    </TouchableOpacity>
                </View>
                <View style={styles.binding_buttom}>
                    <Buttom
                        //onPress={}
                        containerStyle={styles.buttom_box}
                        style={{ fontSize: 16, color: 'white' }}
                        text={'确定'}
                        />
                </View>
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: CommonStyles.colors.background,
    },
    box_ul: {
        height: 55, backgroundColor: CommonStyles.colors.white, justifyContent: 'center',
    },
    box_bor: {
        borderBottomColor: '#E9EEF3', borderBottomWidth: 1
    },
    box_li: {
        marginLeft: 15, marginRight: 15, flexDirection: 'row', justifyContent: 'space-between',
    },
    box_li_lftx: {
        color: '#555555', fontSize: 14
    },
    box_li_rgtx: {
        color: '#ACB5BD', fontSize: 14
    },
    box_li_tx: {
        color: CommonStyles.colors.commonOrange, fontSize: 14
    },
    rule: {
        marginTop: 16, marginBottom: 23, alignItems: 'center'
    },
    rule_tx: {
        color: CommonStyles.colors.commonOrange, fontSize: 12
    },
    binding_buttom: {
        width: Constants.window.width, marginLeft: 30, marginRight: 30,
    },
    //按钮样式
    buttom_box: {
        height: 47, backgroundColor: '#FF8B00', alignItems: 'center',
        justifyContent: 'center', width: Constants.window.width - 60, borderRadius: 8
    },
});

export default TicketChanges;